// 1.用户点击submit按钮直接提交(form+submit+name+action) - 直接完成

// 2.用户名重名检测：如果用户名存在不允许注册。
// 失去焦点事件进行检测
// 检测过程：
// 先通过ajax将用户名传给后端，后端拿到前端的值和数据库里面的值进行匹配，如果数据库里面存在，说明此用户名不能使用。否则可以使用。
// 后端将匹配的结果返回前端，前端提示错误。


// 操作过程：
// 引入或者加载jquey模块
import {} from "https://cdn.bootcdn.net/ajax/libs/jquery/1.12.4/jquery.js";

let $username = $('.username');

let $password = $('.password');
let $repass = $('.again-password');
let $realname = $('.realname');
let $identity = $('.identity');
let $span = $('.row1 span');
let $form = $(' form');
let $flag = true;

let $mobile = $('.mobile');
var $userflag = true;

//用户名判断

//构建Fn方法 判断表单值不正确，清除值
function Fn($name) {
    if ($name.val() === '该用户名已存在') {
        $name.on('focus', function() {
            $name.val('');
            $name.css({
                color: "black"
            })
        })
        console.log(1);
    }
    if ($name.val() === '您输入的格式有误') {
        $name.on('focus', function() {
            $name.val('');
            $name.css({
                color: "black"
            })
        })
        console.log(2);

    }
    if ($name.val() === '请输入账号') {
        $name.on('focus', function() {
            $name.val('');
            $name.css({
                color: "black"
            })
        })
        console.log(3);

    }
}
//用户名判断

$username.on('blur', function() {
    if ($username.val() !== '') {
        var $reg = /^[a-zA-Z0-9_-]{6,25}$/;
        var $len = $username.val().replace(/[\u4e00-\u9fa5]/g, '**').length;
        if ($len >= 6 && $len <= 25) {

            if ($reg.test(this.value)) {
                $username.css({
                    border: '1px solid blue'
                });
                $userflag = true;
                console.log('正确');

            } else {
                $username.val('您输入的格式有误');
                $username.css({
                    color: "red"
                })
                Fn($username);
                $userflag = false;
                console.log('为空1');
            }

        }

    } else {
        $username.val('请输入账号');
        $username.css({
            color: "red"
        })
        Fn($username);
        $userflag = false;
        console.log('为空2');

    }
})

//设置密码
// $password.on('blur', function() {
//     if ($password.val() !== '') {
//         var $reg = /^[a-zA-Z0-9_-]{6,25}$/;
//         /^\S*(?=\S{6,})(?=\S*\d)(?=\S*[A-Z])(?=\S*[a-z])(?=\S*[!@#$%^&*? ])\S*$/
//         if ($reg.test(this.value)) {
//             $password.css({
//                 border: '1px solid blue'
//             })
//             $userflag = true;
//         } else {
//             $password.val('您输入的格式有误');
//             $password.css({
//                     color: "red"
//                 })
//                 //再次点击
//             Fn($password);
//         }
//     } else {
//         $password.val('请输入密码');
//         $password.css({
//                 color: "red"
//             }) //再次点击
//         Fn($password);

//     }
// })







// //失去焦点将前端的用户名传给后端
$username.on('blur', function() {
    $.ajax({
        type: 'post',
        url: 'http://10.31.165.47:8088/projiect/projectname/php/reg.php',
        data: {
            checkname: $username.val()
        }
    }).done(function(data) { //根据后端的返回值确定是否重名
        if (data === 'true') { //存在
            console.log("该用户名已存在");
            $username.val('该用户名已存在');
            $username.css('color', 'red');
            Fn($username);

            $flag = false;
        } else if (data === 'false') {
            // $username.html('√');
            // $username.css('color', 'green');
            $flag = true;
            console.log('数据库');
        }
    });
});

// //阻止浏览器的submit跳转，如果用户名不能通过，不允许提交注册。
$form.on('submit', function() {
    if (!$flag) {
        return false;
    }
});